

<!-- 
    DashboardAside使用AsideHelper组件，该组件需要接收一个数组作为参数，
    该数组是为了递归渲染菜单的，数组中的每个元素都是一个对象，对象中包含菜单的名称、路径、子菜单等属性。

    格式如下：

    menus: [
        {
        menuID: '5',                        primary key
        menuIcon: 'Location',               图标
        menuPath: '/myDetail',              路径
        menuName: '我的',                   菜单名称
        menuComponent: '../views/common/userInfo/Detail.vue',           vue主件
        children: [                         子主件
            {
                menuID: '16',               
                menuIcon: 'Location',
                menuPath: '/updatepassword',
                menuName: '修改密码'
                menuComponent: '../views/common/userInfo/Detail.vue',
            },
        }
    ]
 -->

<script>


/*
    AsideHelper是为了实现动态菜单，思想是递归，
*/
import AsideHelper from './AsideHelper.vue'

export default {
    name: 'dashboardAside',
    components: { AsideHelper },
    // 接收父组件传递的菜单数据
    props: ['menus'],
}
</script>

<template>
    <el-scrollbar id="dashboard-aside" height="100vh">

        <el-menu router class="menu-layout">
            <AsideHelper :menus="menus"></AsideHelper>
        </el-menu>

    </el-scrollbar>
</template>


<style scoped lang="scss">
// #dashboard-aside {
//     // .menu-layout {
//     //     margin-bottom: 50px;
//     // }
// }
</style>